<template>
    <div class="page">
        <search-box class="search-view"/>
        <div class="swiper-box">
            <swiper :options="imgs"/>
        </div>

        <van-list v-model="loading" :finished="finished" @load="onLoad">
            <news-right-icon v-for="(item, key) in dataList" :key="key" :data="item" @onclick="handleToDetail(item.id)"/>
        </van-list>

        <!--<news-right-icon v-for="(item, key) in dataList" :key="key" :data="item" @onclick="handleToDetail(item.id)"/>-->

    </div>
</template>

<style lang="less" scoped>
    .page {
        .search-view {
            /*margin-top: 4.3rem;*/
        }
        .swiper-box {
            margin: .9rem;
        }

    }
</style>

<script>

    import {study} from 'api';

    export default {
        data() {
            return {
                imgs: [
                    'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1536523566399&di=f2056ec1199b996c5b3f8b4e2137158f&imgtype=0&src=http%3A%2F%2Fe.hiphotos.baidu.com%2Fimage%2Fpic%2Fitem%2Fa9d3fd1f4134970aac6a290c98cad1c8a7865df3.jpg',
                    'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1536523566399&di=f2056ec1199b996c5b3f8b4e2137158f&imgtype=0&src=http%3A%2F%2Fe.hiphotos.baidu.com%2Fimage%2Fpic%2Fitem%2Fa9d3fd1f4134970aac6a290c98cad1c8a7865df3.jpg',
                ],

                dataList: [],
                loading: false,
                finished: false,
                pageSize: 10,
                pageNumber: 1
            }
        },
        created() {
            // this.requestData();
        },
        methods: {
            requestData() {
                this.loading= true;
                this.$axios.get(study.API_INFORMATION,{
                    params: {
                        pageSize: this.pageSize,
                        pageNumber: this.pageNumber,
                    }
                }).then(({data}) => {
                    this.loading= false;

                    let {list} = data;
                    this.finished = !list.length;
                    list = list.map(o => ({
                        title: o.title,
                        date: new Date(o.createtime).toAppTime(true),
                        src: o.imgpath,
                        id: o.id
                    }));

                    this.dataList = this.dataList.concat(list);
                }).catch(()=>{
                    this.loading= false;
                })
            },
            handleToDetail(id) {
                this.$router.push('/study/detail/' + id);
            },

            onLoad() {
                this.pageNumber += 1;
                // this.requestData();
            }
        }
    }
</script>
